<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>患者复诊</title>
		<!-- 引入样式文件 -->
		<link rel="stylesheet" href="../../common/css/vant-index.css" />
		<link rel="stylesheet" href="../css/monitor.css" />

		<!-- 引入 Vue 和 Vant 的 JS 文件 -->
		<script src="../../common/js/vue.min.js"></script>
		<script src="../../common/js/axios.min.js"></script>
		<script src="../../base.js"></script>
		<script src="../../common/js/vue.global.prod.js"></script>
		<!-- 引入 viewer 图片预览样式文件 -->
		<link href="../../common/css/viewer.css" rel="stylesheet" />
		<style>
			body {
				background-color: #f3f3f3;
			}

			.icon {
				display: inline-block;
				border-radius: 15px;
				height: 0.9rem;
				width: 0.4rem;
				margin-left: 0.8rem;
				margin-right: 0.5rem;
				background-color: rgb(18, 8, 161);
			}

			.container {
				border: 1px solid #f5f5f5;
				background-color: #fff;
				box-shadow: -1px 5px 5px #ececec;
				border-radius: 10px;
				margin: 0.6rem;
				padding: 0;
				/*height: 15rem;*/
				position: relative;
			}

			.container1 {
				border: 1px solid #f5f5f5;
				box-shadow: -1px 5px 5px #ececec;
				border-radius: 40px;
				margin: 0.6rem;
				padding: 0;
				background-color: #fff;
				height: auto;
				position: relative;
			}

			.container2 {
				border: 1px solid #f5f5f5;
				box-shadow: -1px 5px 5px #ececec;
				border-radius: 40px;
				margin: 0.6rem;
				padding: 0;
				background-color: #fff;
				height: auto;
				position: relative;
			}

			.van-cell {
				border-radius: 15px;
			}

			.visit_img {
				margin-top: 1.8rem;
				margin-left: 0.8rem;
				width: 66px;
				height: 66px;
				border-radius: 66px;
			}

			.img_icon {
				position: relative;
				margin-left: 1rem;
				width: 1.3rem;
				height: 1.3rem;
				top: 0.3rem;
			}

			.visit_name {
				margin-left: 0.8rem;
				margin-right: 1rem;
				font-size: 16px;
				color: rgba(81, 81, 81, 100);
			}

			.visit_value {
				position: relative;
				margin-left: 0.5rem;
			}

			.text_color {
				color: rgba(62, 62, 62, 100);

				font-size: 14px;
			}

			.visit_button {
				width: 100%;
				height: 31px;
			}

			p {
				margin: 0.5rem 0;
			}

			.process_img {
				width: 2rem;
				height: 2rem;
			}

			.text_color1 {
				color: rgba(161, 161, 161, 100);
				font-size: 14px;
			}

			.end {
				width: 15rem;
				height: 3rem;
				margin: 3rem auto;
			}

			.end_btn {
				width: 15rem;
				height: 3rem;
				margin: 0 auto;
			}

			.van-cell__value {
				position: relative;
			}

			.div1 {
				/*position: absolute;
            top: 9rem;
            left: 5rem;*/
				display: inline-block;
				width: 60%;
				margin-left: 20%;
				margin-top: 10px;
				margin-bottom: 1rem;
			}

			.container1 > .van-cell > .van-cell__title {
				flex: 3;
			}

			.container2 > .van-cell > .van-cell__value {
				text-align: left;
				padding-left: 14px;
			}
		</style>
	</head>

	<body>
		<div id="app" v-cloak>
			<van-nav-bar
				v-if='from=="patient"'
				title="患者复诊"
				left-text="返回"
				left-arrow
				@click-left="onClickLeft"
				@click-right="onClickRight"
			>
				<template #right>
					<van-icon name="wap-home-o" size="18" />
				</template>
			</van-nav-bar>

			<div style="margin-top: 0.6rem">
				<span
					style="
						display: inline-block;
						width: 6px;
						background-color: #01cd9c;
						height: 20px;
						line-height: 20px;
						border-radius: 4px;
						text-align: center;
						left: 10px;
						top: 103px;
						margin-left: 0.8rem;
						margin-right: 0.5rem;
					"
					alt=""
				></span>
				<span
					style="left: 26px; 
            position: absolute;
            top: {{titletop}}
            width: 64px;
            height: 20px;
            line-height:20px;
            color: rgba(62, 62, 62, 100);
            font-size: 16px;
            text-align: center;
            font-family: PingFangSC-regular;"
					>个人信息</span
				>
			</div>
			<div class="container van-clearfix" id="container" @click="toPatient">
				<div style="float: left; width: 25%">
					<img
						v-if="!list.patientsImg"
						src="../img/logo.png"
						class="visit_img"
					/>
					<img
						v-if="list.patientsImg"
						:src="list.patientsImg"
						class="visit_img"
					/>
				</div>
				<div style="float: left; margin-top: 1rem; width: 70%">
					<p>
						<span class="visit_name">{{list.patientsName}}</span>
						<span class="visit_value text_color1">{{list.age}}岁</span>
						<span
							><img
								src="../img/follow/woman.png"
								class="img_icon"
								v-if="list.patientsSex==2"
						/></span>
						<span
							><img
								src="../img/follow/men.png"
								class="img_icon"
								v-if="list.patientsSex==1"
						/></span>
					</p>
					<p
						style="
							margin-left: 0.8rem;
							color: rgba(161, 161, 161, 100);
							font-size: 14px;
						"
					>
						糖尿病类型：<span class="text_color"
							>{{list.patientsDiabetisTypeName}}</span
						>
					</p>
					<p
						style="
							margin-left: 0.8rem;
							color: rgba(161, 161, 161, 100);
							font-size: 14px;
						"
					>
						确诊日期：<span class="text_color"
							>{{list.patientsConfirmedDate}}</span
						>
					</p>
					<p
						v-if="list.patientsDesc"
						style="
							margin-left: 0.8rem;
							color: rgba(161, 161, 161, 100);
							font-size: 14px;
						"
					>
						简要病史：<span class="text_color">{{list.patientsDesc}}</span>
					</p>
				</div>
				<div class="div1">
					<van-button
						round
						:color="color"
						v-if="status==4"
						:disabled="disabled"
						class="visit_button"
						id="statusValue"
					>
						{{statusValue}}
					</van-button>
				</div>
			</div>
			<div style="position: relative">
				<div
					style="
						display: flex;
						justify-content: space-between;
						margin: 0 0.8rem;
						align-items: center;
					"
				>
					<div style="display: flex">
						<span
							style="
								display: inline-block;
								background-color: #01cd9c;
								width: 6px;
								height: 20px;
								border-radius: 4px;
							"
						></span>
						<span
							style="
								margin-left: 0.5rem;
								color: rgba(62, 62, 62, 100);
								font-size: 16px;
							"
							>复诊流程
							<van-icon
								name="replay"
								color="#595757"
								v-if="status==4"
								@click="replay"
						/></span>
					</div>
					<span style="color: rgba(62, 62, 62, 100); font-size: 16px"
						>{{time}}</span
					>
				</div>
				<div class="container1">
					<van-cell v-for="item in list1" key="index">
						<template #title>
							<span class="custom-title">{{item.projectName}}</span>
						</template>
						<template #value>
							<div
								style="
									position: absolute;
									right: 0;
									top: 50%;
									transform: translate(-50%, -50%);
								"
							>
								<img
									src="../img/follow/complete.png"
									class="process_img"
									v-if="item.projectStatus==1"
								/>
							</div>
							<div
								style="
									position: absolute;
									right: 0;
									top: 50%;
									transform: translate(-50%, -50%);
								"
								@click="updatetStatus(item)"
							>
								<img
									src="../img/follow/incomplete.png"
									class="process_img"
									v-if="item.projectStatus==0"
								/>
							</div>
						</template>
						<template #label>
							<div class="custom-title">详情：{{item.projectDetail}}</div>
							<div class="custom-title" v-if="item.executor">
								操作人：{{item.executor}}
							</div>
							<div class="custom-title" v-if="item.remark">
								备注：{{item.remark}}
							</div>
						</template>
					</van-cell>
				</div>
			</div>
			<div style="position: relative" v-if="status==2">
				<div style="display: flex; align-items: center">
					<span
						style="
							display: inline-block;
							width: 6px;
							background-color: #01cd9c;
							height: 20px;
							line-height: 20px;
							border-radius: 4px;
							text-align: center;
							left: 10px;
							top: 103px;
							margin-left: 0.8rem;
							margin-right: 0.5rem;
						"
						alt=""
					></span>
					<span style="color: rgba(62, 62, 62, 100); font-size: 16px"
						>患者评价</span
					>
				</div>

				<div class="container2" v-if="flupEvaluation">
					<van-cell v-if="value1">
						<template #title>
							<span class="custom-title">服务</span>
						</template>
						<template #value>
							<van-rate
								v-model="value1"
								readonly
								:size="25"
								color="#ffd21e"
								void-icon="star"
								void-color="#eee"
							/>
						</template>
					</van-cell>
					<van-cell v-if="value2">
						<template #title>
							<span class="custom-title">舒适度</span>
						</template>
						<template #value>
							<van-rate
								v-model="value2"
								readonly
								:size="25"
								color="#ffd21e"
								void-icon="star"
								void-color="#eee"
							/>
						</template>
					</van-cell>
					<van-cell v-if="value3">
						<template #title>
							<span class="custom-title">设备</span>
						</template>
						<template #value>
							<div>
								<van-rate
									v-model="value3"
									readonly
									:size="25"
									color="#ffd21e"
									void-icon="star"
									void-color="#eee"
								/>
							</div>
						</template>
					</van-cell>
					<van-cell v-if="patientSuggest">
						<template #title>
							<span class="custom-title">其他建议</span>
						</template>
						<template #value>
							<span class="custom-title">{{patientSuggest}}</span>
						</template>
					</van-cell>
				</div>
				<div
					class="container"
					style="text-align: center"
					v-if="!flupEvaluation&&from=='patient'"
					@click="linkToEval"
				>
					<img src="../img/follow/none_eval.png" style="width: 40%" />
					<p style="font-size: 12px; color: rgba(0, 0, 0, 0.45)">
						复诊已结束，点此进行满意度评价
					</p>
				</div>
				<div
					class="container"
					style="text-align: center"
					v-if="!flupEvaluation&&from=='doctor'"
				>
					<img src="../img/follow/none_eval.png" style="width: 40%" />
					<p style="font-size: 12px; color: rgba(0, 0, 0, 0.45)">
						患者暂未进行满意度评价
					</p>
				</div>
			</div>
			<div class="end">
				<van-button
					round
					color="#E22E30"
					@click="setFollowStatus"
					class="end_btn"
					v-if="status == 4&&from =='doctor'"
					>结束复诊
				</van-button>
			</div>
			<link-index v-if='from=="doctor"'></link-index>
		</div>
	</body>
	<script src="../../common/js/index.umd.js"></script>
	<script src="../../common/js/url.min.js"></script>
	<script src="../../common/js/vant.min.js"></script>
	<script type="module">
		import {
			getAction,
			postAction,
			getUrl,
			spliceUrl,
		} from '../../common/js/api/vue3-axios-utils.js'

		import { linkIndex } from '../js/linkIndex.js'
		import { is_weixn } from '../js/wechat1.js'

		const app = Vue.createApp({
			data() {
				return {
					url: {
						getfollowList: '/108/01/1080104',
						getprocess: '/flup/flow',
						setFollowStatus: '/flup/patient/status/update',
						setItemStatus: '/flup/patient/item/save',
					},
					id: '',
					statusValue: '复诊开始',
					list: [],
					list1: [],
					value1: '',
					value3: '',
					time: '',
					value2: '',
					patientSuggest: '',
					color: '#E22E30',
					disabled: false,
					status: '',
					titletop: '55px',
					flupEvaluation: '',
					show: false,
					path: '',
				}
			},
			created() {
				this.from = url('?from')
				this.id = url('?flupid')
				if (url('?from') == 'doctor' && is_weixn()) {
					this.titletop = '0px'
					this.path = '?' + window.location.search.substring(1)
					console.log(
						'pah',
						window.location.search.substring(1),
						window.location.href
					)
					const code = url('?code')
					if (!localStorage.getItem('did')) {
						if (code) {
							// 授权完成，通过code换取用户id，跳转页面
							this.handleGetUserInfoByWechatCode(code)
						} else {
							const url = encodeURIComponent(this.initCallbackUrl())
							window.location.href = this.createAuthUrl(url)
						}
					}
				}
				if (url('?patientid')) {
					this.patientid = url('?patientid')
				} else if (url('?userid')) {
					this.patientid = url('?userid')
				}
				if (document.referrer.match('/doctor/i')) {
					//根据上层网址来源判断缓存
					$.ownStore.removeStaffName()
					$.ownStore.removeStaffId()
					console.log(
						'remove',
						$.ownStore.getStaffId(),
						$.ownStore.getStaffName()
					)
				}
				this.getfollowList()
				this.getprocess()
			},
			methods: {
				setFollowStatus() {
					let url = getUrl() + this.url.setFollowStatus
					postAction(url, { flupId: this.id, type: 2 }).then(res => {
						if (res.data.success) {
							console.log('res', res.data.result)
							this.$toast({
								message: '已结束本次复诊',
							})
							this.getprocess()
						}
					})
				},
				updatetStatus(record) {
					console.log('record', record)
					var code = url('?code')
					if (this.status == 4 && this.from == 'doctor') {
						window.location.href =
							'./finishItem.html?flupid=' +
							this.id +
							'&itemid=' +
							record.flupItemId +
							'&patientid=' +
							this.patientid
					}
				},
				getfollowList() {
					let pid
					if (this.from) {
						pid = this.patientid
					} else {
						pid = localStorage.pid
					}
					let params = {
						patientId: pid,
					}
					let url = getUrl() + this.url.getfollowList
					postAction(url, params).then(res => {
						if (res.data.success) {
							this.list = res.data.result
						}
					})
				},
				replay() {
					this.$toast({
						message: '刷新中',
					})
					this.getprocess()
				},
				getprocess() {
					let params = {
						flupId: this.id,
					}
					let url = getUrl() + this.url.getprocess
					getAction(url, params).then(res => {
						if (res.data.success) {
							if (res.data.result.flupEvaluation !== null) {
								this.flupEvaluation = res.data.result.flupEvaluation
								this.patientSuggest =
									res.data.result.flupEvaluation.otherSuggest
								this.value1 = res.data.result.flupEvaluation.serviceEvaluation
								this.value2 = res.data.result.flupEvaluation.equipmentEvaluation
								this.value3 = res.data.result.flupEvaluation.comfortEvaluation
							}

							this.list1 = res.data.result.flupFLowItems
							this.time = res.data.result.flupBasicInfo.flupDate
							this.status = res.data.result.flupStatus
							if (res.data.result.flupStatus == 4) {
								this.statusValue = '复诊中'
								this.color = '#9c9c9c'
								this.disabled = true
							}
							// if (res.data.result.flupStatus == 1) {
							//     this.statusValue = '复诊开始'
							// }
							if (res.data.result.flupStatus !== 3) {
							} else {
							}
						}
					})
				},
				toPatient() {
					window.location.href = '../index.html?userid=' + this.patientid
				},
				onClickLeft() {
					window.location.href =
						'./followRecord.html?from=patient&userid=' + this.patientid
				},
				onClickRight() {
					window.location.href = '../index.html?userid=' + this.patientid
				},
				linkToEval() {
					window.location.href =
						'./evalution.html?from=patient&flupid=' +
						this.id +
						'&userid=' +
						this.patientid
				},
				handleGetUserInfoByWechatCode(code) {
					let url = getUrl() + '/sys/wechat/oa/patient/login'
					postAction(url, {
						identity: 2,
						jsCode: code,
					}).then(res => {
						res = res.data
						if (res.success) {
							localStorage.setItem('did', res.result.userId)
						} else {
							console.log(res.message)
						}
					})
				},
				initCallbackUrl() {
					const protocol = document.location.protocol + '//'
					const page = this.path
					let host = window.location.host
					console.log(host)
					const pathname = window.location.pathname
					if (host.indexOf('test') != -1) {
						host = 'h5.test.dtx-tech.com'
					}

					console.log('path', protocol + host + pathname + page)
					return protocol + host + pathname + page
				},
				createAuthUrl(url) {
					console.log(url)
					return (
						'https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx856bd338d5ffb469&redirect_uri=' +
						url +
						'&response_type=code&scope=snsapi_userinfo&state=doctor#wechat_redirect'
					)
				},
			},
			components: {
				linkIndex: linkIndex,
			},
		})
		app.use(vant)

		app.use(vant.Lazyload)
		app.use(VueViewer.default)

		app.mount('#app')
	</script>
</html>
